<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>
        logView
    </title>
    <meta name="description" content="view">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, user-scalable=no, minimal-ui">
    <link rel="shortcut icon" th:href="@{/img/fav.ico}"/>
    <!-- Icons -->
    <link th:href="@{/css/nucleo-icons.css}" rel="stylesheet">

    <!-- Theme CSS -->
    <link type="text/css" th:href="@{/css/blk-design-system.css}" rel="stylesheet">
    <link type="text/css" th:href="@{/css/jquery-confirm.css}" rel="stylesheet">
    <link type="text/css" th:href="@{/demo/demo.css}" rel="stylesheet">
</head>
<body class="index-page">
<!--    <nav class="navbar navbar-expand-lg fixed-top bg-info " >-->
<nav class="navbar navbar-expand-lg fixed-top navbar-transparent">
    <div class="container">
        <div class="navbar-translate">
            <a class="navbar-brand" th:href="@{/index}" rel="tooltip" title="" data-placement="bottom" target="_blank"
               data-original-title="新开一个窗口查看文件目录信息">
                <span>Log•</span> View System
            </a>
            <button class="navbar-toggler navbar-toggler" type="button" data-toggle="collapse" data-target="#navigation"
                    aria-controls="navigation-index" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-bar bar1"></span>
                <span class="navbar-toggler-bar bar2"></span>
                <span class="navbar-toggler-bar bar3"></span>
            </button>
        </div>
        <div class="collapse navbar-collapse justify-content-end" id="navigation">
            <div class="navbar-collapse-header">
                <div class="row">
                    <div class="col-6 collapse-brand">
                        <a>
                            LogView•
                        </a>
                    </div>
                    <div class="col-6 collapse-close text-right">
                        <button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#navigation"
                                aria-controls="navigation-index" aria-expanded="false" aria-label="Toggle navigation">
                            <i class="tim-icons icon-simple-remove"></i>
                        </button>
                    </div>
                </div>
            </div>
            <ul class="navbar-nav">
                <li class="nav-item">
                    <a class="nav-link" href="javascript:void(0)" onclick="logout()">
                        <i class="tim-icons icon-button-power"></i> 退出
                    </a>
                </li>
            </ul>
        </div>
    </div>
</nav>
<div class="main">
    <div class="section section-signup" style="margin-top: -60px;">
        <div class="container">
            <div class="squares square-1"></div>
            <div class="squares square-2"></div>
            <div class="squares square-3"></div>
            <div class="squares square-4"></div>
            <!--        <div class="container">-->
            <div class="row row-grid justify-content-between align-items-center">
                <div class="col-lg-12 mb-lg-auto">
                    <div class="card " style="width:100%;">
                        <div class="card-header bg-info text-center">
                            <!--                            <img class="card-img" th:src="@{/img/square1.png}" alt="Card image">-->
                            <h2 class="card-title text-white ">文件浏览</h2>
                        </div>
                        <div class="card-body" style="height: 440px;">
                            <h5 class="text-left current-path">当前路径：</h5>
                            <ul id="fileViewUl" class="nav nav-pills nav-pills-primary nav-pills-icons">

                            </ul>
                        </div>
                        <div class="card-footer text-center">
                            <a href="javascript:void(0)" class="btn btn-info btn-sm btn-round "
                               onclick="goBackParent()">
                                <i class="tim-icons icon-double-left"></i>
                                上级
                            </a>
                            <a href="javascript:void(0)" class="btn btn-primary btn-sm btn-round download">
                                <i class="tim-icons icon-cloud-download-93"></i>
                                下载
                            </a>
                            <a href="javascript:void(0)" class="btn btn-success btn-sm btn-round upload"
                               data-toggle="modal" data-target="#myModal1">
                                <i class="tim-icons icon-cloud-upload-94"></i>
                                上传
                            </a>
                            <a href="javascript:void(0)" class="btn btn-warning btn-sm btn-round shell"
                               data-toggle="modal" data-target="#shellWindow">
                                <i class="tim-icons icon-triangle-right-17"></i>
                                命令
                            </a>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Large modal -->
<div class="modal fade modal-black modal-lg" id="shellWindow"  tabindex="-1" role="dialog"
     aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog" style="height: 442px;">
        <div class="modal-content" style="width: 800px;">
            <div class="modal-body" >
                <div class="col-sm-16" >
                    <div id="text" style="background-color: #000;
                        border-top: #ccc outset 2px;
                        height: 420px;
                        width:100%;
                        overflow-y: scroll;">
                        <ul id="contentUl" style=" margin: 0px; padding: 0px; list-style: none;">
                            <li>提示，你可以执行以下命令启动java，警告：请不要输入不会自动结束的命令例如netstat  ping -t date等</li>
                            <li>示例: E: & cd E:/a/b & start 1.bat</li>
                            <li>示例: netstat -ano|findstr "80" 或者linux的 netstat -ano|grep "80"</li>
                            <li>示例: taskkill -f -pid 112 或者linux kill -f -p 112 示例: tasklist |findstr "112" 或者linux ps -ef|grep "java"</li>
                            <li>&nbsp;</li>
                            <li>LogView Shell [版本 1.0.0.111] 点击下行开始输入 [点击空白区域关闭窗口] </li>
                        </ul>
                        <input type="text" name="" id='in' style="background-color: #000;
                                        border: 0;
                                        color: #00FF00;
                                        font-weight: bold;
                                        outline: none;
                                        /*font-size:12px;*/
                                        width: 100%">
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade modal-black " id="myModal1" tabindex="-1" data-backdrop="static" role="dialog"
     aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header justify-content-center">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    <i class="tim-icons icon-simple-remove text-white"></i>
                </button>
                <div class="modal-profile">
                    <i class="tim-icons icon-cloud-upload-94"></i>
                </div>
            </div>

            <div class="modal-body">
                <form id="uploadModalForm" th:action="@{/file/upload}" enctype="multipart/form-data" method="post">
                    <div class="col-sm-12">
                        <input name="file" multiple type="file" data-show-caption="true" id="file"/>
                    </div>
                </form>
                <!--                    <div class="progress-container progress-success">-->
                <!--                        <span class="progress-badge">Success</span>-->
                <!--                        <div class="progress">-->
                <!--                            <div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="60"-->
                <!--                                 aria-valuemin="0" aria-valuemax="100" style="width: 60%;">-->
                <!--                                <span class="progress-value">60%</span>-->
                <!--                            </div>-->
                <!--                        </div>-->
                <!--                    </div>-->
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-link btn-neutral file-upload-btn" onclick="fileUpload()">提交
                </button>
                <button type="button" class="btn btn-link btn-neutral" data-dismiss="modal">取消</button>
            </div>

        </div>
    </div>
</div>
<script th:src="@{/js/core/jquery.min.js}"></script>
<script th:src="@{/js/core/popper.min.js}"></script>
<script th:src="@{/js/core/bootstrap.min.js}"></script>
<!--    <script th:src="@{/js/plugins/perfect-scrollbar.jquery.min.js}"></script>-->
<!--    <script th:src="@{/js/plugins/bootstrap-switch.js}"></script>-->
<!--    <script th:src="@{/js/plugins/nouislider.min.js}"></script>-->
<!--    <script th:src="@{/js/plugins/moment.min.js}"></script>-->
<script th:src="@{/demo/demo.js}"></script>

<!-- Theme JS -->
<script th:src="@{/js/blk-design-system.js}"></script>
<script th:src="@{/js/plugins/jquery.slimscroll.min.js}"></script>
<script th:src="@{/js/logView.js}"></script>
<script th:src="@{/js/plugins/jquery-confirm.js}"></script>
<script type="text/javascript">
    var currentPath = getUrlParam("path");
    var filePath = '';
    var commandIndex = 0;
    var commandArr = new Array();
    $(function () {
        //一开始默认加载根路径的目录
        getFilesDirectory(null, currentPath, 0);
        //添加滚动区域
        $(".card-body").slimScroll({height: 440, wheelStep: 13});
        //下载
        $(".download").click(function () {
            if (filePath.indexOf(".") !== -1) {
                window.location.href = getRootPath() + "/file/download?path=" + filePath;
            } else {
                logViewAlert('当前选择不是一个文件，无法下载');
            }
        });

        //-----s-----------------------tart  shell 窗口脚本 -------------------------------//
        $('#shellWindow').on('shown.bs.modal', function () {
            $("#in")[0].focus();
        });
        $('#shellWindow').bind('keydown', function (event) {
            if (event.keyCode === 13) {
                if(commandArr[commandArr.length-1] != $("#in").val()) {
                    commandArr.push($("#in").val());
                }
                $.ajax({
                    type: "POST",
                    url: getRootPath()+"/execute",
                    data: "code=" + encodeURIComponent($("#in").val()),
                    success: function (msg) {
                        $("#contentUl").append("<li style='color:#00FF00;font-weight: bold;'>" + $("#in").val() + "</li>"); //将输入的输出到界面

                        var content = msg.bizObj.replaceAll("\n", "</li><li>");
                        content = content.replaceAll(" ","&nbsp;");

                        $("#contentUl").append("<li>" + content + "</li>"); //获取返回值并输出

                        $("#in").val(""); //清空输入框
                        $('#text').scrollTop($("#text").scrollTop()+1000);
                        $("#in")[0].focus();
                    }
                });
            }else if(event.keyCode === 38) {
                if(commandArr.length === 0) {
                    return;
                }
                $("#in").val('');
                commandIndex = commandIndex -1;
                if(commandIndex < 0) {
                    commandIndex = commandArr.length-1;
                }
                $("#in").val(commandArr[commandIndex]);
            }else if(event.keyCode === 40) {
                if(commandArr.length === 0) {
                    return;
                }
                $("#in").val('');
                commandIndex = commandIndex + 1;
                if(commandIndex === commandArr.length) {
                    commandIndex = 0;
                }
                $("#in").val(commandArr[commandIndex]);
            }
        });
        //----------------------------------end  shell 窗口脚本 ---------------------------//

    });

    //文件浏览窗口 上一次点击的对象，用于处理单击变色
    var itemOfOld = null;


    /**
     * 文件上传
     */
    function fileUpload() {
        if (currentPath != '') {
            // $(".file-upload-btn").attr("disabled",true);

            var formData = new FormData();
            formData.append("file", $('#file')[0].files[0]);

            formData.append("fileUrl", currentPath);

            $.ajax({
                url: getRootPath() + '/file/upload',
                type: 'POST',
                async: false,
                timeout: 30000000,
                data: formData,
                processData: false, // 使数据不做处理
                contentType: false, // 不要设置Content-Type请求头
                success: function (data) {
                    // $(".file-upload-btn").attr("disabled",false);
                    if (handlerResult(data)) {
                        $("#myModal1").modal('hide');
                        $('#file').val('');
                        logViewAlert("上传文件成功!");
                        getFilesDirectory(null, currentPath, 0);
                    }
                },
                error: function (response) {
                    console.log(response);
                }
            });
        } else {
            logViewAlert("当前空路径，不允许上传文件，请重新选择目录");
        }


    }

    /**
     * 获取文件目录
     * @param item 当前点击的组件
     * @param parentDir 父节点目录路径
     * @param ftype 0 目录  1 文件
     */
    function getFilesDirectory(item, parentDir, ftype) {
        var method = "file/service/getFileList/V1.0";
        //临时变量记录，防止跟返回上级目录方法处理冲突。
        var paramPath = parentDir;

        if (paramPath !== '' && paramPath.indexOf("/") === -1) {
            paramPath = paramPath + "/";
        }
        $('.current-path').html("当前路径：" + paramPath);
        filePath = paramPath;
        var params = {"parentDir": paramPath};
        if (ftype == '0') {
            $.ajax(
                {
                    url: getRootPath() + '/api/gateway.do',
                    type: 'post',
                    dateType: 'json',
                    headers: {'Content-Type': 'application/json;charset=utf8'},
                    data: JSON.stringify(getGlobalParams(params, method)),
                    success: function (data) {
                        if (handlerResult(data)) {
                            var view = $("#fileViewUl");
                            view.detach();
                            $(".card-body").append("<ul id=\"fileViewUl\" class=\"nav nav-pills nav-pills-primary nav-pills-icons\"></ul>");
                            view = $("#fileViewUl");
                            currentPath = parentDir;

                            var files = data.bizObj;
                            if (files != null && files.length != 0) {
                                for (var i = 0; i < files.length; i++) {
                                    var file = files[i];
                                    var classStr = '';
                                    var classStr2 = '';
                                    var actionContent = '';
                                    var fileTypeName = '';
                                    if (file.type === 0) {
                                        classStr = 'icon-tv-2';
                                        classStr2 = 'badge-danger';
                                        fileTypeName = "目录";
                                        actionContent = 'href="javascript:void(0);"  onclick="getFilesDirectory(this,\'' + file.dir + '\',\'' + file.type + '\');" ';
                                    } else {
                                        classStr = 'icon-single-copy-04';
                                        classStr2 = 'badge-success';
                                        fileTypeName = '文件';
                                        if (file.name.toUpperCase().indexOf(".LOG") != -1
                                            || file.name.toUpperCase().indexOf(".HTML") != -1
                                            || file.name.toUpperCase().indexOf(".JS") != -1
                                            || file.name.toUpperCase().indexOf(".CSS") != -1
                                            || file.name.toUpperCase().indexOf(".XML") != -1
                                            || file.name.toUpperCase().indexOf(".TXT") != -1
                                            || file.name.toUpperCase().indexOf(".BAT") != -1
                                            || file.name.toUpperCase().indexOf(".YML") != -1
                                            || file.name.toUpperCase().indexOf(".PROPERTIES") != -1
                                            || file.name.toUpperCase().indexOf(".SH") != -1) {
                                            actionContent = 'href="' + getRootPath() + '/view?path=' + file.dir + '"';
                                        } else {
                                            actionContent = 'href="javascript:void(0);"  onclick="getFilesDirectory(this,\'' + file.dir + '\',\'' + file.type + '\');" ';
                                        }
                                    }

                                    var content = '<li class="nav-item">\n' +
                                        '        <a class="nav-link " ' + actionContent + '\n' +
                                        '           data-toggle="tooltip" data-placement="bottom" title="总容量: ' + file.totalSpace + 'M 空闲: ' + file.freeSpace + 'M 文件大小: ' + file.usedSpace + '" >' +
                                        '           <i class="tim-icons ' + classStr + '"></i><span class="badge ' + classStr2 + '">' + fileTypeName + '</span><br>' + file.name + '' +
                                        '          </a>\n' +
                                        '        </li>';
                                    view.append(content);
                                }
                            }
                        }
                    },
                    error: function (data) {
                        logViewAlert("error");
                    }
                }
            );
        } else {
            //手动添加class变更颜色
            if (itemOfOld != null) {
                var oldClassVar = itemOfOld.getAttribute("class");
                oldClassVar = oldClassVar.replace("active", "");
                itemOfOld.setAttribute("class", oldClassVar);
            }
            var classVar = item.getAttribute("class");
            classVar = classVar.concat(" active");
            item.setAttribute("class", classVar);
            itemOfOld = item;
        }
    }

    //退出登录
    function logout() {
        // 提交用户名和密码给后台
        $.ajax({
            url: getRootPath() + "/logout",
            type: "POST",
            dataType: "json",
            success: function (data) {
                if (handlerResult(data)) {
                    window.location.href = getRootPath() + "/login";
                }
            }
        });
    }

    //返回上一级
    function goBackParent() {
        var tempPath = currentPath;
        if (tempPath.charAt(tempPath.length - 1) === '/') {
            tempPath = "";
        } else {
            tempPath = tempPath.substring(0, tempPath.lastIndexOf("/"));
        }
        getFilesDirectory(null, tempPath, 0);
    }


</script>
</body>
</html>
